<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org" >
<meta charset="utf-8">
<head th:include="include :: header"></head>
<link th:href="@{/js/jquery-ztree/3.5/css/metro/zTreeStyle.css}" rel="stylesheet"/>
<body class="childrenBody">
	<form class="layui-form" style="width:80%;margin-top: 10px">
		<div class="layui-form-item layui-row layui-col-xs12">
			<label class="layui-form-label">角色名称</label>
			<div class="layui-input-block">
				<input type="text" name="roleName" id="roleName" class="layui-input roleName" lay-verify="required" placeholder="请输入角色名称">
			</div>
		</div>
		<div class="layui-form-item layui-row layui-col-xs12">
			<label class="layui-form-label">权限字符</label>
			<div class="layui-input-block">
				<input type="text" name="roleKey" id="roleKey" class="layui-input roleKey" lay-verify="required" placeholder="请输入权限字符">
			</div>
		</div>
		<div class="layui-form-item layui-row layui-col-xs12">
			<label class="layui-form-label">显示顺序</label>
			<div class="layui-input-block">
				<input type="number" name="roleSort" id="roleSort" class="layui-input roleSort" lay-verify="number" placeholder="请输入显示顺序">
			</div>
		</div>
		<div class="layui-form-item layui-row layui-col-xs12">
			<label class="layui-form-label">备注</label>
			<div class="layui-input-block">
				<input type="text" id="remark" name="remark" class="layui-input remark" placeholder="请输入备注">
			</div>
		</div>
		<div class="layui-form-item layui-row layui-col-xs12">
			<label class="layui-form-label">菜单权限</label>
			<div id="tree" class="ztree layui-col-xs8" ></div>
		</div>
		<div class="layui-form-item layui-row layui-col-xs12">
			<label class="layui-form-label"></label>
			<div class="layui-input-block">
				<button class="layui-btn " lay-submit="" lay-filter="add">立即添加</button>
				<button type="button" class="layui-btn  layui-btn-primary close">取消</button>
			</div>
		</div>
	</form>
	<div th:include="include::footer"></div>
	<script th:src="@{/js/jquery.min.js}"></script>
	<script th:src="@{/js/jquery-ztree/3.5/js/jquery.ztree.all-3.5.js}"></script>
	<script th:src="@{/js/role/add.js}"></script>
</body>
</html>